<div th:fragment="control_base">
	<script type="text/javascript">
		$(function() {
//			ImgSelectModel.init();
		});

		/**图片选择窗口*/
		function ImgSelectModel() {
		}
		/**显示*/
		ImgSelectModel.show = function(callback) {
			$("#imgModal").modal("show");
			$("#imgModal").one("hide.bs.modal", function() {
				var id = $("#imgModal").data("imgId");
				callback(id);
			})
		}
		/**初始化*/
		ImgSelectModel.init = function() {
			/**绑定图片选择按钮事件*/
			$("#imgModal").find("#selectImgBtn").on(
					"click",
					function() {
						var id = $("#imgModal").find(
								".img-container-selected:eq(0)").attr("id");
						$("#imgModal").data("imgId", id);
						$("#imgModal").modal("hide");
					});
			$("#imgModal").on("dblclick", ".img-container", function() {
				var id = $(this).attr("id");
				$("#imgModal").data("imgId", id);
				$("#imgModal").modal("hide");
			}).on(
					"click",
					".img-container",
					function() {
						$(this).addClass("img-container-selected").siblings()
								.removeClass("img-container-selected");
					})
			ImgSelectModel.loadImg();
		}
		/**加载图片*/
		ImgSelectModel.loadImg = function(params) {
			$.QuickRemote.AjaxJson("/tjfx/image/queryImage", function(result) {
				$("#imgContainer").empty();
				$.each(result, function() {
					var id = this["_id"]["$oid"];
					var TPMS = this["TPMS"];
					var src = "/tjfx/image/recriveImage/" + id;
					var imgBlock = $($("#img-block").html());
					$(imgBlock).attr("id", id);
					$(imgBlock).find("img").attr("lay-src", src);
					$(imgBlock).find("span.TPMS").text(TPMS);
					$(imgBlock).appendTo($("#imgContainer"));
					$(imgBlock).find("span.glyphicon-trash").on("click",
							function() {
								$.QuickAlert.alertConfirm({
									content : "是否删除",
									callback : function() {
										deleteImage(id);
									}
								})
							})
				})

				layui.use('flow', function() {
					var flow = layui.flow;
					flow.lazyimg({
						scrollElem : ".imgContainer"
					});
				});
			});
		}

		/** 图表元数据父类 */
		function metadata_base(params) {
			this.metadata = $.extend({}, params);
			this.getMetadata = function(key) {
				if (key)
					return this.metadata[key];
				else
					return this.metadata;
			};
			this.setMetadata = function(metadataName, value) {
				this.metadata[metadataName] = value;
				$(this).trigger("metadata_change", {
					"metadataName" : metadataName,
					"value" : value
				});
			}
		}

		/** 图表 控制面板 控制器 */
		function metadata_view_base(control) {
			this.control = control;
			this.settingPanel = $("#form-control-setting");
			this.linkageMetadata = function(metadataName, value) {
				this.control.setMetadata(metadataName, value);
			}
		}

		/** 元数据 表单 视图 */
		function metadata_form_view_base(control) {
			this.control = control;
		}
	</script>

	<script type="text/html" id="img-block">
<div class="col-sm-4 img-container">
	<a href="javascript:void(0)" class="thumbnail img-a">
		<span class="TPMS">图片名称</span>
		<img class="lay-img" lay-src="http://www.gbtags.com/gb/laitu/350x150" class="img-responsive">
	</a>
</div>
</script>
</div>